<ion-item-divider>Additional Info</ion-item-divider>
<ion-grid *ngIf="pkg.manifest as manifest">
  <ion-row>
    <ion-col responsiveCol sizeXs="12" sizeMd="6">
      <ion-item-group>
        <ion-item>
          <ion-label>
            <h2>Version</h2>
            <p>{{ manifest.version | displayEmver }}</p>
          </ion-label>
        </ion-item>
        <ion-item
          *ngIf="manifest['git-hash'] as gitHash; else noHash"
          button
          detail="false"
          (click)="copy(gitHash)"
        >
          <ion-label>
            <h2>Git Hash</h2>
            <p>{{ gitHash }}</p>
          </ion-label>
          <ion-icon slot="end" name="copy-outline"></ion-icon>
        </ion-item>
        <ng-template #noHash>
          <ion-item>
            <ion-label>
              <h2>Git Hash</h2>
              <p>Unknown</p>
            </ion-label>
          </ion-item>
        </ng-template>
        <ion-item button detail="false" (click)="presentModalLicense()">
          <ion-label>
            <h2>License</h2>
            <p>{{ manifest.license }}</p>
          </ion-label>
          <ion-icon slot="end" name="chevron-forward"></ion-icon>
        </ion-item>
        <ion-item
          [href]="manifest['marketing-site']"
          [disabled]="!manifest['marketing-site']"
          target="_blank"
          rel="noreferrer"
          detail="false"
        >
          <ion-label>
            <h2>Marketing Site</h2>
            <p>{{ manifest['marketing-site'] || 'Not provided' }}</p>
          </ion-label>
          <ion-icon slot="end" name="open-outline"></ion-icon>
        </ion-item>
      </ion-item-group>
    </ion-col>
    <ion-col responsiveCol sizeXs="12" sizeMd="6">
      <ion-item-group>
        <ion-item
          [href]="manifest['upstream-repo']"
          target="_blank"
          rel="noreferrer"
          detail="false"
        >
          <ion-label>
            <h2>Source Repository</h2>
            <p>{{ manifest['upstream-repo'] }}</p>
          </ion-label>
          <ion-icon slot="end" name="open-outline"></ion-icon>
        </ion-item>
        <ion-item
          [href]="manifest['wrapper-repo']"
          target="_blank"
          rel="noreferrer"
          detail="false"
        >
          <ion-label>
            <h2>Wrapper Repository</h2>
            <p>{{ manifest['wrapper-repo'] }}</p>
          </ion-label>
          <ion-icon slot="end" name="open-outline"></ion-icon>
        </ion-item>
        <ion-item
          [href]="manifest['support-site']"
          [disabled]="!manifest['support-site']"
          target="_blank"
          rel="noreferrer"
          detail="false"
        >
          <ion-label>
            <h2>Support Site</h2>
            <p>{{ manifest['support-site'] || 'Not provided' }}</p>
          </ion-label>
          <ion-icon slot="end" name="open-outline"></ion-icon>
        </ion-item>
        <ion-item
          [href]="manifest['donation-url']"
          [disabled]="!manifest['donation-url']"
          target="_blank"
          rel="noreferrer"
          detail="false"
        >
          <ion-label>
            <h2>Donation Link</h2>
            <p>{{ manifest['donation-url'] || 'Not provided' }}</p>
          </ion-label>
          <ion-icon slot="end" name="open-outline"></ion-icon>
        </ion-item>
      </ion-item-group>
    </ion-col>
  </ion-row>
</ion-grid>
